<template>
  <div>
    <my-map v-bind:mapInfo="mapInfo"
            @onClickNode="onClickNode"
            @postInitMap="postInitMap"
    />
  </div>
</template>

<script>
  import MyMap from '../MyMap'
  import {shpJsonPage11ShuiChang_1DiErShuiChang, shpJsonPage11ShuiChang_2DiLiuShuiChang, shpJsonPage11ShuiChang_3SanPingWuHua} from './shpJson'
  import {stateManager} from "../StateManager";
  import {Const} from "../Const";
  import {MyMapShpJsonAdapter} from "../MyMapShpJsonAdapter";
  let interval = null

  export default {
    name: 'Page11ShuiChang',
    components: {
      MyMap: MyMap,
    },
    data() {
      return {
        shpJsonPage11ShuiChang_1DiErShuiChang,
        shpJsonPage11ShuiChang_2DiLiuShuiChang,
        shpJsonPage11ShuiChang_3SanPingWuHua,
        /*************************************
         * Step 1
         * 1）basicMapInfo，MyMap初始化后，获取基础数据，canvas 长，宽，字体
         * 2）mapInfo，地图信息（Model）
         *************************************/
        basicMapInfo: {},
        mapInfo: null,
        myMapShpJsonAdapter: new MyMapShpJsonAdapter()
      }
    },
    methods: {
      onClickNode(node) {
        let data = node.data
        let mxdID = this.myMapShpJsonAdapter.getMxdIDByNodeData(data)
        let dataID = this.myMapShpJsonAdapter.getDataIDFromNodeData(data)
        let pageName = this.myMapShpJsonAdapter.getPageNameByMxdID(mxdID, dataID)
        if (pageName) {
          stateManager.setMxdID(mxdID)
          this.$router.push(pageName)
        }else {
          stateManager.setMxdID('无路径的测试值')
          if(dataID.includes('SC')) this.$router.push('/Page12ShuiKu')
          else if(dataID.includes('LH')) this.$router.push('/Page12ShuiKu')
        }
      },
      /*************************************
       * Step 2 获取绘制地图的基础信息
       *************************************/
      postInitMap(basicMapInfo) {
        this.basicMapInfo = basicMapInfo
      }
    },
    mounted() {
      let shpJson = null
      let mxdID = stateManager.getMxdID()
      if (mxdID === Const.mxdID_水厂详情页_三坪五化) {
        console.log('进入[三坪五化]');
        shpJson = shpJsonPage11ShuiChang_3SanPingWuHua
      }else if (mxdID === Const.mxdID_水厂详情页_第二水厂) {
        console.log('进入[第二水厂]');
        shpJson = shpJsonPage11ShuiChang_1DiErShuiChang
      }else if (mxdID === Const.mxdID_水厂详情页_第六水厂) {
        console.log('进入[第六水厂]');
        shpJson = shpJsonPage11ShuiChang_2DiLiuShuiChang
      }else {
        console.log('进入[其他测试]');
        shpJson = shpJsonPage11ShuiChang_2DiLiuShuiChang
      }
      /*************************************
       * Step 3 转换地图数据
       *************************************/
      let mapInfo = new MyMapShpJsonAdapter().getMapInfo(this.basicMapInfo, shpJson)

      /*************************************
       * Step 4 更新地图数据
       *************************************/
      this.mapInfo = mapInfo
      let monitorInfo = this.myMapShpJsonAdapter.getMonitorInfoFromMapInfo(mapInfo);
      if (monitorInfo.dataIDList.length > 0) {
        const req = () => {
          this.$post({
            url: '/dispatch/productOverive/resource/info',
            data: monitorInfo.dataIDList,
          }).then((data) => {
            let infoList = data.map(i => ({
              dataID: i.dataId,
              value: i.value
            }))
            let oldInfoList = this.myMapShpJsonAdapter.getInfoListByMonitorInfo(monitorInfo)
            // console.log(monitorInfo.dataIDList)
            // console.log({oldInfoList})
            // console.log({data, infoList})
            let mapInfo = this.myMapShpJsonAdapter.getMapInfoByInfoList(this.mapInfo, monitorInfo, infoList)
            this.mapInfo = {
              ...mapInfo
            }
          })
        }
        req()
        // 一分钟一次
        interval = setInterval(req, 60000)
      }
    },
    destroyed() {
      clearInterval(interval)
    }
  }
</script>

<style scoped>
</style>
